<extend name="Layout:layout_dialog" />
<block name="body_main">
    <div class="grid-parent xsui-page-header">
        <div class="grid-parent">
            <a href="#" class="xsui-btn ui-state-default xsui-lnk-expand">
                <if condition="$conf_tree_state_expand">
                    <i class="fa fa-plus-square-o"></i><span>全部展开</span>
                    <else/>
                    <i class="fa fa-minus-square-o"></i><span>全部收起</span>
                </if>
            </a>
            <a href="#" class="xsui-btn ui-state-default xsui-lnk-refresh"><i class="fa fa-refresh"></i>刷新</a>
        </div>
    </div>
    <div id="grid-container">
        <form action="{:U('user_department_save')}" method="post" class="xsui-form">
            <table class="xsui-table xsui-table-striped xsui-table-hover xsui-table-bordered xsui-table-tree" data-checkbox-attr='name="id[]" value=":value"' data-role-url="{:U('Role/get_role_tree_json')}">
                <thead>
                    <tr><th>名称</th><th>角色</th></tr>
                </thead>
                <tbody>
                <foreach name="tree" item="vo">
                    <tr data-key="{$vo.id}" class="xsui-table-tree-l1"><td class="title"><i class="prefix"></i>{$vo.title}</td><td><select name="role"></select></td></tr>
                    <foreach name="vo['children']" item="vo2">
                        <tr data-key="{$vo2.id}" class="xsui-table-tree-l2"><td class="title"><i class="prefix"></i>{$vo2.title}</td><td><select name="role"></select></td></tr>
                        <foreach name="vo2['children']" item="vo3">
                            <tr data-key="{$vo3.id}" class="xsui-table-tree-l3"><td class="title"><i class="prefix"></i>{$vo3.title}</td><td><select name="role"></select></td></tr>
                        </foreach>
                    </foreach>
                </foreach>
                </tbody>
            </table>
            <button type="submit" class="ui-state-default"><i class="fa fa-save"></i>保存</button>
            <button type="reset" class="ui-state-default">重置</button>
            <input type="hidden" name="uid" value="{$uid}"/>
            <input type="hidden" name="department_ids" value="{$department_ids}"/>
        </form>
    </div>
</block>
<block name="body_after">    
    <script type="text/javascript">
        $(function () {
            reset();
            // 重置表单 2016-1-14 SoChishun Added.
            function reset() {
                var ids = $('[name="department_ids"]').val().split(',');
                $(ids).each(function () {
                    $(':checkbox[value="' + this + '"]').prop('checked', true);
                })
            }
            ajax_combobox({selector: 'select[name="role"]', url: $('.xsui-table').data('roleUrl'), def_option: '请选择角色'});
            // 自动添加展开收缩图标 2015-10-29 SoChishun Added.
            $('tr.xsui-table-tree-l1').each(function () {
                if ($(this).next().is('.xsui-table-tree-l2')) {
                    $(this).find('.prefix').after('<a href="#" class="xsui-icon-only xsui-lnk-expend"><i class="fa fa-minus-square-o fa-fw"></i></a>');
                }
            });
            // 动态展开收缩 2015-10-29 SoChishun Added.
            $('td .lnk-expend').click(function () {
                var $a = $(this);
                var $i = $a.find('i');
                if ($i.hasClass('fa-plus-square-o')) {
                    $i.toggleClass('fa-plus-square-o').toggleClass('fa-minus-square-o');
                    $a.parent().parent().nextUntil('.xsui-table-tree-l1').show();
                } else {
                    $i.toggleClass('fa-plus-square-o').toggleClass('fa-minus-square-o');
                    $a.parent().parent().nextUntil('.xsui-table-tree-l1').hide();

                }
                return false;
            })
            // 展开全部 2015-10-29 SoChishun Added.
            $('.xsui-page-header .lnk-expand').click(function () {
                var $i = $(this).find('i');
                if ($i.hasClass('fa-plus-square-o')) {
                    $i.toggleClass('fa-plus-square-o').toggleClass('fa-minus-square-o').next().text('全部收起');
                    $('.xsui-table-tree-l1 .lnk-expend i').removeClass('fa-plus-square-o').removeClass('fa-minus-square-o').addClass('fa-minus-square-o');
                    $('.xsui-table-tree-l2,.xsui-table-tree-l3').show();
                } else {
                    $i.toggleClass('fa-plus-square-o').toggleClass('fa-minus-square-o').next().text('全部展开');
                    $('.xsui-table-tree-l1 .lnk-expend i').removeClass('fa-plus-square-o').removeClass('fa-minus-square-o').addClass('fa-plus-square-o');
                    $('.xsui-table-tree-l2,.xsui-table-tree-l3').hide();

                }
                return false;
            })
        })
    </script>
</block>